<div style="font-weight: bold; font-size: 20px; margin-top: 20px"> ${serialNumber}、其他区域用户数TOP5 </div>
<div id="focus-area-other-top5-desc" style="text-indent: 2em;font-size:20px;margin-top: 20px;line-height: 35px;">
    <!-- 选取关注区域为其他类型的区域，统计本周累计用户数，用户数量从多到少排行前5的区域如下图所示，区域1累计用户数量为x万，排名第一，其次是区域2，累计用户数量共x万，区域3排名第三，累计用户数量为x万。-->
</div>
<div id="myecharts4" style="width: 1000px; height: 400px; margin: 0 auto; margin-top: 20px"></div>

<script>
    (function () {

        $(document).ready(function () {
            // 四、其他区域用户数TOP5
            /*var areaData = [
                { area: "海口", count: 6 },
                { area: "白沙", count: 565 },
                { area: "陵水", count: 44 },
                { area: "三亚", count: 221 },
                { area: "琼海", count: 41 },
                { area: "文昌", count: 400 },
                { area: "万宁", count: 144 },
                { area: "东方", count: 94 },
                { area: "儋州", count: 664 },
            ];*/
            var areaData = ${focusAreaOtherTop5}
            var myecharts4 = echarts.init(document.getElementById("myecharts4"));
            var barYAxisData = $.map(areaData, function(n, i){ return n.areaName  })
            var barValues = $.map(areaData, function(n, i){ return n.count })
            var optionBar2 = {
                title: {
                    text: "其他区域用户数TOP5",
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "shadow",
                    },
                },
                color: ['#4b91ff'],
                legend: false,
                grid: {
                    left: "3%",
                    right: "4%",
                    bottom: "3%",
                    containLabel: true,
                },
                xAxis: {
                    type: "category",
                    data: barYAxisData,
                },
                yAxis: {
                    type: "value",
                    boundaryGap: [0, 0.01],
                    axisLabel: {
                        fontSize: 14,
                        show: true,
                        formatter: function(params) {
                            console.log(params)
                            var result = ''
                            result = params / 10000
                            if (params > 1000) {
                                return result + '万'
                            } else {
                                return params
                            }
                        },
                    },
                },
                series: [
                    {
                        type: "bar",
                        data: barValues
                    }
                ]
            }
            myecharts4.setOption(optionBar2);
            $("#focus-area-other-top5-desc").text("${focusAreaOtherTop5Desc}");
        })
    })()
</script>